<!DOCTYPE html>
<html lang="en">
<head>
  <title>array anyof</title>
  <meta charset="utf-8"/>
  <script src="../../dist/jsoneditor.js"></script>
</head>
<body>

<h1>Test</h1>
<label for="debug">Value</label>
<textarea id="debug" class="debug" cols="30" rows="10"></textarea>
<button class='get-value'>Get Value</button>
<div class='container'></div>

<script>
  var container = document.querySelector('.container');
  var debug = document.querySelector('.debug');
  var schema = {
    "title": "anyOf",
    "type": "object",
    "properties": {
      "correct": {
        "type": "string",
        "pattern": "^[a-zA-Z0-9_]+$",
        "maxLength": 50
      },
      "items": {
        "title": "title",
        "type": "array",
        "format": "tabs",
        "items": {
          "title": "item",
          "headerTemplate": "{{self.handler}}",
          "options": {
            "keep_oneof_values": false
          },
          "anyOf": [
            {
              "$ref": "#/definitions/a"
            },
            {
              "$ref": "#/definitions/b"
            },
            {
              "$ref": "#/definitions/c"
            }
          ]
        }
      }
    },
    "defaultProperties": [
      "correct",
      "items"
    ],
    "definitions": {
      "a": {
        "title": "item a",
        "type": "object",
        "properties": {
          "handler": {
            "type": "string",
            "default": "aaa"
          },
          "id": {
            "type": "string",
            "pattern": "^[a-zA-Z0-9_]+$",
            "maxLength": 50
          },
          "___a": {
            "title": "___",
            "type": "string"
          }
        }
      },
      "b": {
        "title": "item b",
        "type": "object",
        "properties": {
          "handler": {
            "default": "bbb"
          },
          "id": {
            "type": "string",
            "pattern": "^[a-zA-Z0-9_]+$",
            "maxLength": 50
          },
          "___b": {
            "title": "___",
            "type": "string"
          }
        }
      },
      "c": {
        "title": "item c",
        "type": "object",
        "properties": {
          "params": {
            "properties": {
              "items": {
                "title": "sub items",
                "type": "array",
                "format": "tabs",
                "items": {
                  "options": {
                    "keep_oneof_values": false
                  },
                  "title": "sub item",
                  "headerTemplate": "{{self.handler}}",
                  "anyOf": [
                    {
                      "$ref": "#/definitions/a"
                    },
                    {
                      "$ref": "#/definitions/b"
                    }
                  ]
                }
              }
            }
          },
          "handler": {
            "default": "ccc"
          },
          "___c": {
            "title": "___",
            "type": "string"
          }
        }
      }
    }
  };

  var editor = new JSONEditor(container, {
    schema: schema
  });

  document.querySelector('.get-value').addEventListener('click', function () {
    debug.value = JSON.stringify(editor.getValue());
  });

</script>

</body>
</html>
